<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta
			http-equiv="X-UA-Compatible"
			content="IE=edge"
		/>
		<meta
			name="viewport"
			content="width=device-width, initial-scale=1.0"
		/>
		<title>博客列表页</title>

		<link
			rel="stylesheet"
			href="css/common.css"
		/>
		<link
			rel="stylesheet"
			href="css/list.css"
		/>
	</head>
	<body>
		<div class="nav">
			<img
				src="pic/logo2.jpg"
				alt=""
			/>
			<span class="blog-title">我的博客系统</span>
			<div class="space"></div>
			<a
				class="nav-span"
				href="blog_list.html"
				>主页</a
			>
			<a
				class="nav-span"
				href="blog_edit.html"
				>写博客</a
			>
			<a
				class="nav-span"
				href="#"
				onclick="logout()"
				>注销</a
			>
		</div>

		<div class="container">
			<div class="left">
				<div class="card">
					<img
						src="pic/doge.jpg"
						alt=""
					/>
					<h3></h3>
					<a href="#">GitHub 地址</a>
					<div class="row">
						<span>文章</span>
						<span>分类</span>
					</div>
					<div class="row">
						<span>2</span>
						<span>1</span>
					</div>
				</div>
			</div>
			<div class="right"></div>
		</div>
		<link
			rel="stylesheet"
			href="blog-editormd/css/editormd.css"
		/>
		<link
			rel="stylesheet"
			href="css/common.css"
		/>
		<link
			rel="stylesheet"
			href="css/list.css"
		/>
		<script src="js/jquery.min.js"></script>
		<script src="js/common.js"></script>
		<script src="blog-editormd/lib/marked.min.js"></script>
		<script src="blog-editormd/lib/prettify.min.js"></script>
		<script src="blog-editormd/editormd.js"></script>
		<script src="constants/response.js"></script>
		<script>
			getBlogList()
			function getBlogList() {
				$.ajax({
					url: '/blog/getList',
					type: 'get',
					success(result) {
						if (result && result.code === RESPONSE_CODE_STATUS.success && result.data) {
							const { data } = result
							let html = ``
							let index = 0
							for (let key in data) {
								const { title, updateTime, id } = data[key]
								html += `
<div class="blog">
  <div class="title">${title}</div>
  <div class="date">${updateTime}</div>
  <div class="desc" id="desc${index}" style="background-color: transparent;"></div>
  <a
    class="detail"
    href="blog_detail.html?blogId=${id}"
    >查看全文&gt;&gt;</a
  >
</div>`
                index++
							}
              // 渲染
							$('.container .right').html(html)
              // 更新
							index = 0
              for (let key in data) {
								const { content } = data[key]
                editormd.markdownToHTML(`desc${index}`, {
									markdown: content,
								})
								index++
              }
						} else {
							// 没有数据或请求错误
						}
					},
					error(result) {
						if (result.status === 401) {
              location.assign('./blog_login.html')
            }
					},
				})
			}

			let url = '/user/getUserInfoByToken'
			getUserInfo(url)
		</script>
	</body>
</html>
